/*
 * @Description: 别名表单
 * @Author: Rfan
 * @Date: 2022-07-09 10:31:34
 * @LastEditTime: 2022-07-09 12:14:16
 */

import { Form, Input, Table, Typography } from 'antd';

const { Column } = Table;

interface IAliasFormProps {
  check?: boolean;
}

const AliasForm = ({ check }: IAliasFormProps) => {
  return (
    <>
      {check ? (
        <>
          <Form.Item name="cname" label="名称" valuePropName="children" required>
            <Typography.Text />
          </Form.Item>
          <Form.Item name="businessKey" label="KEY" valuePropName="children" required>
            <Typography.Text />
          </Form.Item>
        </>
      ) : (
        <>
          <Form.Item name="cname" label="中文名" required>
            <Input allowClear />
          </Form.Item>
          <Form.Item name="businessKey" label="KEY" required>
            <Input allowClear />
          </Form.Item>
        </>
      )}
      <Form.List name="languageList">
        {(fields, { add, remove }, { errors }) => (
          <>
            <Form.Item label="多语言" required={false}>
              <Table dataSource={fields} size="small" pagination={false} bordered>
                <Column
                  title="语言类型"
                  dataIndex="key"
                  key="key"
                  align="center"
                  render={(_value, record: any) => (
                    <Form.Item
                      {...record}
                      key={record.key}
                      name={[record.name, 'language']}
                      noStyle
                      valuePropName="children"
                    >
                      <Typography.Text />
                    </Form.Item>
                  )}
                />
                <Column
                  title="名称"
                  dataIndex="name"
                  key="name"
                  align="center"
                  render={(value, record: any) => (
                    <Form.Item
                      {...record}
                      key={record.key}
                      name={[record.name, 'name']}
                      valuePropName={check ? 'children' : 'value'}
                      noStyle
                    >
                      {check ? <Typography.Text /> : <Input />}
                    </Form.Item>
                  )}
                />
                {/* <Column
                    title={formatMessage('tableAction')}
                    align="center"
                    render={(_val, record: any) => (
                      <Button type="link" onClick={() => remove(record.name)}>
                        清空
                      </Button>
                    )}
                  /> */}
              </Table>
            </Form.Item>
          </>
        )}
      </Form.List>
      <Form.Item name="remark" label="描述" valuePropName={check ? 'children' : 'value'}>
        {check ? <Typography.Text /> : <Input.TextArea />}
      </Form.Item>
    </>
  );
};

export default AliasForm;
